<template>
  <div id="header">

    <div class="dh">
      <img class="jst" src="../../static/images/logo.png" />
      <a class="iconfont sy" href="#">首页</a>
      <span class="iconfont xza">下载</span>
      <input class="ss" type="text" placeholder="    搜索" />
      <span class="iconfont fdj">&#xe60c;</span>
      <a href="#" class="iconfont dl">登录</a>
      <span class="iconfont ">&#xe636;</span>
      <span class="zc">注册</span>
      <div class="xwzd">
        <span class="iconfont">&#xe61b;</span>
        <span>写文章</span>
      </div>
    </div>

  </div>
</template>



<script>
  export default{

  }
</script>

<style>
	body{
		margin: 0;
		padding: 0;
	}
.dh{
  width: 100%;
  height: 100px;
  position: relative;
  top: -60px;
  border-bottom: 1px solid #C0C0C0;
}
.jst{
	width: 230px;
	height: 100px;
 float: left;
 margin-left: -30px;
 margin-top: -10px;
}
.dh > a{
  text-decoration: none;
}
.sy{
  float: left;
  padding-top: 32px;
  padding-left: 50px;
  color: 	#FF7F50;
} 
.xza{
  float: left;
  padding-top: 32px;
  padding-left: 40px;
}
.ss{
  float: left;
  height: 30px;
  border: 0px;
  border-radius: 20px;
  background-color: #DCDCDC;
  margin-left: 20px;
  margin-top: 29px;
  outline: medium;
}
.fdj{
  float: left;
  padding-top: 34px;
  margin-left: -30px;
}
.xwzd{
  width: 100px;
  height: 37px;
  float: right;
  border-radius: 15px;
  padding-top: 10px;
  margin-top: 20px;
  margin-right: 30px;
  color: white;
  background-color: #FF6347;
}
.dl{
  float: left;
  color: #808080;
  margin-top: 32px;
  margin-left: 540px;
}
.Aa{
  float: left;
  color: #808080;
  margin-top: 32px;
  margin-left: 30px;
}
.zc{
  width: 60px;
  height: 25px;
  float: left;
  border-radius: 30px;
  padding-top: 10px;
  color: #FF7F50;
  border: 1px solid #FF7F50;
  margin-top: 20px;
  margin-left: 20px;
}
</style>
